<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<button id="btn">获取验证码</button>
	<script>
		var flag = true;
		var timerID = null;
		btn.onclick = function() {
			if (!flag) {
				//  上一次的没有走完
				return  
			}

			//  重新进入关闭   false=false  就说明上一次没有走完
			flag = false
			//alert(11111)
			/* 
			点击按钮：
				+ 显示倒计时  59  58   57 。。。。
				+ 再次点击不能点击  必须等时间走完后才能走
			 */
			var num = 5
			timerID = setInterval(() => {
				num--
				btn.innerHTML = num + '秒'
				/// 判断是否走完  
				if (num <= 0) {
					flag = true //  表示当前一次走完了
					clearInterval(timerID)
					btn.innerHTML = '获取验证码'
				}
			}, 1000)
		}
	</script>
</body>

</html>
